<template>
  <el-dialog title="活动商品" :close-on-click-modal="false" :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="100px">
      <el-form-item label="活动价" prop="price_type">
        <el-radio-group v-model="dataForm.price_type">
          <el-radio :label="0">固定折扣</el-radio>
          <el-radio :label="1">固定减价 </el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="dataForm.price_type == 0" prop="discount" :rules="[
          { required: true, message: '固定折扣不能为空', trigger: 'blur' },
        ]">
        <el-col :span="4">
          <el-input-number v-model="dataForm.discount" :min="0" :precision="1" :controls="false" :max="10"></el-input-number>
        </el-col>
        <el-col :span="12" :offset="2">
          <span>折</span>
          <span>
            <el-button type="primary" @click="goSet">设置</el-button>
          </span>
        </el-col>
      </el-form-item>
      <el-form-item v-if="dataForm.price_type == 1" prop="fix_price" :rules="[
          { required: true, message: '固定减价不能为空', trigger: 'blur' },
        ]">
        <el-col :span="4">
          <el-input-number v-model="dataForm.fix_price" :min="0" :precision="2" :controls="false" :max="100000"></el-input-number>
        </el-col>

        <el-col :span="12" :offset="2">
          <span>元</span>
          <span>
            <el-button type="primary" @click="setFixPrice">设置</el-button>
          </span>
        </el-col>
      </el-form-item>

      <el-table :data="dataList" row-key="Id" border style="width: 100%; margin-top: 30px">
        <el-table-column prop="sku_set_name" align="center" label="规格">
        </el-table-column>

        <el-table-column prop="cost_price" align="center" label="成本价">
        </el-table-column>
        <el-table-column prop="sale_price" align="center" label="原价">
        </el-table-column>
        <el-table-column prop="activity_price" align="center" label="价格">
          <template slot-scope="scope">
            <el-input-number v-model="scope.row.activity_price" :min="0" :precision="2" :controls="false" :max="100000"></el-input-number>
          </template>
        </el-table-column>
      </el-table>
      <el-form-item label="限购数量" prop="limit_buy_num" class="mt30">
        <el-col :span="4">
          <el-input-number v-model="dataForm.limit_buy_num" :min="0" :precision="0" :controls="false" :max="10000000"></el-input-number>
        </el-col>
        <el-col :span="12" :offset="2">件 每个用户允许购买的最大数量（输入0不限购）</el-col>

      </el-form-item>

      <el-form-item label="可售数量" prop="real_stock_total">
        <el-col :span="4">
          <el-input-number v-model="dataForm.real_stock_total" :min="0" :precision="0" :controls="false" :max="100000"></el-input-number>
        </el-col>
        <el-col :span="12" :offset="2">此次活动所有SKU可售数量</el-col>
      </el-form-item>
      <el-form-item label="初始销量" prop="init_sale_num">
        <el-col :span="4">
          <el-input-number v-model="dataForm.init_sale_num" :min="0" :precision="0" :controls="false" :max="10000000"></el-input-number>
        </el-col>
      </el-form-item>

      <el-form-item label="团购人数" prop="group_people_num">
        <el-col :span="4">
          <el-input-number v-model="dataForm.group_people_num" :min="2" :precision="0" :controls="false" :max="10000000"></el-input-number>
        </el-col>
        <el-col :span="12" :offset="2">人团</el-col>
      </el-form-item>
      <el-form-item label="商品排序" prop="sort">
        <el-input-number v-model="dataForm.sort" :min="0" :precision="0" :controls="false" :max="10000000"></el-input-number>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="celForm()">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { treeDataTranslate } from '@/utils'
import seviceApi from '@/api/serviceApi.js'
export default {
  data () {
    return {
      visible: false,
      dataForm: {
        goods_id: null, // 商品id
        group_buy_id: null, // 拼团活动id
        price_type: null, // 0固定折扣,1固定减价
        discount: null, // 固定折扣
        fix_price: null, // 固定减价
        limit_buy_num: null, // 限购
        sort: null, // 商品排序
        real_stock_total: null, // 真实库存总数
        init_sale_num: null, // 初始化销量
        group_people_num: null, // 成团总人数
        group_buy_goods_sku_list: []
      },
      dataList: [],
      dataRule: {
        price_type: [
          {
            required: true,
            message: '活动价不能为空',
            trigger: 'blur'
          }
        ],
        real_stock_total: [
          {
            required: true,
            message: '可售数量不能为空',
            trigger: 'blur'
          }
        ],
        init_sale_num: [
          {
            required: true,
            message: '初始销量不能为空',
            trigger: 'blur'
          }
        ],
        group_people_num: [
          {
            required: true,
            message: '团购人数不能为空',
            trigger: 'blur'
          }
        ],
        sort: [
          {
            required: true,
            message: '商品排序不能为空',
            trigger: 'blur'
          }
        ],
        limit_buy_num: [
          {
            required: true,
            message: '限购数量不能为空',
            trigger: 'blur'
          }
        ]
      }
    }
  },

  methods: {
    celForm () {
      this.visible = false
    },
    init (id, groupBuyId, goodsId) {
      this.dataForm.id = id || null
      this.visible = true
      this.dataForm.goods_id = goodsId
      this.dataForm.group_buy_id = groupBuyId
      this.$nextTick(() => {
        this.$refs['dataForm'].resetFields()
      })
      if (id) {
        seviceApi.getActivitygoodsInfo(id).then((res) => {
          if (res && res.data.code == 200) {
            this.dataForm = res.data.data
            seviceApi.getGroupbuySku(id).then((res1) => {
              this.dataList = res1.data.list
            })
          }
        })
      } else {
        // 查询商品所有规格
        if (goodsId) {
          seviceApi.getGoodsSkus(goodsId).then((res) => {
            if (res && res.data.code == 200) {
              res.data.list.forEach((i) => {
                i.activity_price = i.sale_price
              })
              this.dataList = res.data.list
            }
          })
        }
      }
    },
    goSet () {
      if (this.dataForm.discount != '') {
        this.dataList.map((v, i) => {
          v.activity_price = Number(
            v.sale_price * (this.dataForm.discount / 10)
          ).toFixed(2)
        })
      } else {
        this.$message.error('请输入折扣')
      }
    },
    setFixPrice () {
      if (this.dataForm.fix_price != '') {
        if (
          this.dataList.some((val) => val.sale_price <= this.dataForm.fix_price)
        ) {
          this.$message.error('减价金额不得超过商品原价')
          return false
        }
        this.dataList.map((v, i) => {
          v.activity_price = Number(
            v.sale_price - this.dataForm.fix_price
          ).toFixed(2)
        })
      } else {
        this.$message.error('请输入减价')
      }
    },
    // 提交
    dataFormSubmit () {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          if (this.dataForm.id == null || undefined) {
            delete this.dataForm.id
          }
          this.dataForm.group_buy_goods_sku_list = this.dataList
          seviceApi.saveGroupbuyActivitygoods(this.dataForm).then((res) => {
            if (res && res.data.code == 200) {
              this.$message({
                message: '添加成功',
                type: 'success'
              })
              this.visible = false
              this.$emit('updataList', 1)
            }
          })
        }
      })
    }
  }
}
</script>

<style lang="scss">
.mt30 {
  margin-top: 30px;
}
</style>
